// 根据body的属性值来判断主题
body[theme-mode="dark"] {
    --select-background-color: #1a1a1a;
    --sekect-chat-item-background-color: #2d2d2d;
    --verticle-division-color: #1f1f1f;
    --user-tab-background-color: #282828;
    --user-tab-select-background-color: #353535;
    --modal-background-color: #1f1f1f;
    --chat-list-background-color:#1B1B1B;
    --chat-menu-background-color:#111111;
    --chat-panel-background-color:#111111;
    --setting-tong-theme-background-color:#262626;
}

body:not([theme-mode="dark"]) {
    --select-background-color: #eaeaea;
    --sekect-chat-item-background-color: #f5f5f5;
    --verticle-division-color: #e9e9e9;
    --user-tab-background-color: #f5f5f5;
    --user-tab-select-background-color: #FFFFFF;
    --modal-background-color: #e9e9e9;
    --chat-list-background-color:#FFFFFF;
    --chat-menu-background-color:#F2F2F2;
    --chat-panel-background-color:#F2F2F2;
    --setting-tong-theme-background-color:#FFFFFF;
}

.slide-in-bottom {
	-webkit-animation: slide-in-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: slide-in-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
@-webkit-keyframes slide-in-bottom {
    0% {
      -webkit-transform: translateY(1000px);
              transform: translateY(1000px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateY(0);
              transform: translateY(0);
      opacity: 1;
    }
  }
  @keyframes slide-in-bottom {
    0% {
      -webkit-transform: translateY(1000px);
              transform: translateY(1000px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateY(0);
              transform: translateY(0);
      opacity: 1;
    }
  }

  .slide-out-top {
	-webkit-animation: slide-out-top 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
	        animation: slide-out-top 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

@-webkit-keyframes slide-out-top {
    0% {
      -webkit-transform: translateY(0);
              transform: translateY(0);
      opacity: 1;
    }
    100% {
      -webkit-transform: translateY(-1000px);
              transform: translateY(-1000px);
      opacity: 0;
    }
  }
  @keyframes slide-out-top {
    0% {
      -webkit-transform: translateY(0);
              transform: translateY(0);
      opacity: 1;
    }
    100% {
      -webkit-transform: translateY(-1000px);
              transform: translateY(-1000px);
      opacity: 0;
    }
  }
  